<div ng-controller="securityBaseController">


    <div class="security " ng-controller="securityEditRolesController">

        <div class="kuiLocalNav">
            <!--
            <div class="kuiLocalNavRow">
                <div class="kuiLocalNavRow__section">
                    <div class="kuiLocalTitle">
                        {{title()}}
                    </div>
                </div>
            </div>
            -->
            <div class="kuiLocalNavRow__section">
                <div class="headerHeadline"><security-license-warning ></security-license-warning></div>
            </div>

            <div class="kuiLocalNavRow kuiLocalNavRow--secondary">
                <div class="kuiLocalTabs">
                    <a ng-click="selectTab('overview')" ng-class="getTabCss('overview')" id="opendistro_security.roles.tab.overview">Overview</a>
                    <a ng-click="selectTab('clusterpermissions')" ng-class="getTabCss('clusterpermissions')" id="opendistro_security.roles.tab.clusterpermissions">Cluster Permissions</a>
                    <a ng-click="selectTab('indexpermissions')" ng-class="getTabCss('indexpermissions')" id="opendistro_security.roles.tab.indexpermissions">Index Permissions</a>
                    <a ng-click="selectTab('applicationpermissions')" ng-class="getTabCss('applicationpermissions')" id="opendistro_security.roles.tab.applicationpermissions">Tenant Permissions</a>
                </div>
            </div>
        </div>


        <div class="container">
            <div class="row">

                <form securityc-form-focus-added-field name="objectForm" id="object-form" method="post" ng-submit="saveObject($event)" novalidate style="width:70%">

                    <securityc-error-message></securityc-error-message>

                    <div class="col-xs-12">

                        <div ng-show="selectedTab=='overview'">
                            <securityc-form-resource-name></securityc-form-resource-name>

                            <securityc-form-new-resource-field></securityc-form-new-resource-field>


                            <h2 class="euiTitle euiTitle--medium">Members</h2>

                            <h3 class="euiTitle euiTitle--small">Users:</h3>
                            <ul>
                                <li data-ng-repeat="user in rolemapping.users" ng-bind="user"></li>
                            </ul>
                            <div ng-show="!rolemapping.users || rolemapping.users.length == 0" style="font-style: italic">No mapped users found.</div>

                            <h3 class="euiTitle euiTitle--small" style="margin-top:20px;">Backend Roles:</h3>
                            <ul>
                                <li data-ng-repeat="backendrole in rolemapping.backend_roles" ng-bind="backendrole"></li>
                            </ul>
                            <div ng-show="!rolemapping.backend_roles || rolemapping.backend_roles.length == 0" style="font-style: italic">No mapped backend roles found.</div>

                            <h3 class="euiTitle euiTitle--small" style="margin-top:20px;">Hosts:</h3>
                            <ul>
                                <li data-ng-repeat="host in rolemapping.hosts" ng-bind="host"></li>
                            </ul>
                            <div ng-show="!rolemapping.hosts || rolemapping.hosts.length == 0" style="font-style: italic">No mapped hosts found.</div>

                        </div>

                        <div ng-show="selectedTab=='clusterpermissions'">
                            <table class="fullwidth">
                                <tr>
                                    <td>
                                        <h3 class="resourcename euiTitle euiTitle--medium">
                                            {{resourcelabel}}: <span ng-class="{'noresourcename': !resourcename}">{{resourcename || '(no role name defined)'}}</span>
                                            <div class="kuiBadge kuiBadge--default" ng-if="resource.readonly">
                                                <span class="kuiIcon fa-lock"></span>
                                                reserved
                                            </div>
                                        </h3>
                                    </td>
                                </tr>
                            </table>
                            <div class="kuiHeaderBar" style="margin-bottom: 20px; margin-top:10px;">
                                <div class="kuiHeaderBarSection">
                                    <h2 class="kuiSubTitle">Cluster-wide permissions</h2>
                                </div>
                            </div>
                            <securityc-permissions on-should-confirm="confirmRemoveArrayEntry" permissionsResource="resource.cluster_permissions"></securityc-permissions>
                        </div>

                        <!-- Header -->
                        <div ng-show="selectedTab=='indexpermissions'">
                            <table class="fullwidth">
                                <tr>
                                    <td>
                                        <h3 class="resourcename euiTitle euiTitle--medium">
                                            {{resourcelabel}}: <span ng-class="{'noresourcename': !resourcename}">{{resourcename || '(no role name defined)'}}</span>
                                            <div class="kuiBadge kuiBadge--default" ng-if="resource.reserved">
                                                <span class="euiBadge euiBadge--default">
                                                  <span class="euiBadge__content">
                                                        <span class="euiIcon euiIcon--small euiBadge__icon kuiIcon fa-lock"></span>
                                                    <span class="euiBadge__text">reserved</span>
                                                  </span>
                                                </span>
                                            </div>
                                        </h3>
                                    </td>
                                </tr>
                            </table>

                            <!-- Add index permissions -->
                            <div class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionRow euiFlexGroup--responsive">
                                <div class="euiFlexItem">
                                    <h2 ng-show="indicesEmpty()" class="euiTitle euiTitle--xsmall topBottomMargin ng-cloak" >No index permissions configured.</h2>
                                </div>
                                <div class="euiFlexItem euiFlexItem--flexGrowZero ">
                                    <button class="euiButton euiButton--primary eui-alignMiddle" type="button" style="margin-top:15px;"
                                            id="opendistro_security.button.roles.index_permissions.add"
                                            ng-click="addEmptyIndexPermissions()"
                                    >
                                    <span class="euiButton__content">
                                        <span class="euiButton__text">Add index permissions</span>
                                    </span>
                                    </button>
                                </div>
                            </div>

                            <div class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionRow euiFlexGroup--responsive" data-ng-repeat="indexpermission in resource.index_permissions track by $index">
                                <div class="euiFlexItem">
                                    <accordeon title="Index patterns: {{getAccordeonTitle(indexpermission.index_patterns, '(No index patterns configured)')}}" is-collapsed="indexpermission.collapsed" testid="opendistro_security.roles.indexpermissions-{{$index}}" additional-class="euiTitle euiTitle--xsmall">

                                        <!-- Delete index permissions -->
                                        <div class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionRow euiFlexGroup--responsive">
                                            <div class="euiFlexItem">
                                                <h2 class="euiTitle euiTitle--xsmall topBottomMargin" ></h2>
                                            </div>
                                            <div class="euiFlexItem euiFlexItem--flexGrowZero ">
                                                <button class="euiButton euiButton--danger eui-alignMiddle" type="button" style="margin-bottom:15px;"
                                                        id="opendistro_security.button.roles.index_permissions.delete"
                                                        ng-click="confirmRemoveFromObjectArray(resource.index_permissions, $index, getAccordeonTitle(indexpermission.index_patterns, ''))">
                                                    <span class="euiButton__content">
                                                        <span class="euiButton__text">Delete index permissions</span>
                                                    </span>
                                                </button>
                                            </div>
                                        </div>

                                        <!-- Index patterns table -->
                                        <table class="kuiTable tableIndexGroups">
                                            <thead>
                                            <tr>
                                                <th class="kuiTableHeaderCell tableHeaderCellIndexGroups">
                                                    <div class="kuiTableHeaderCell__liner">
                                                        Index patterns:
                                                        <div style="display: inline;">
                                                <span class="kuiInfoButton help" tooltip='The index patterns the permissions apply to.'>
                                                    <span class="kuiIcon fa-info-circle"></span>
                                                </span>
                                                        </div>
                                                    </div>
                                                </th>
                                                <th class="kuiTableHeaderCell tableHeaderCellIndexGroups actions">
                                                    <div class="kuiTableHeaderCell__liner">
                                                    </div>
                                                </th>
                                            </tr>
                                            </thead>
                                            <tbody>
                                            <tr class="kuiTableRow" ng-if="!indexpermission.index_patterns.length">
                                                <td class="kuiTableRowCell" colspan="2" >
                                                    <div class="kuiPanel--centered">
                                                        <div class="kuiEmptyTablePrompt kuiEmptyTablePrompt--nopadding">
                                                            <div class="kuiEmptyTablePrompt__message ng-binding">No index patterns configured.</div>
                                                        </div>
                                                    </div>
                                                </td>
                                            </tr>

                                            <tr data-ng-repeat="indexpattern in indexpermission.index_patterns track by $index">
                                                <td class="kuiTableRowCell cellAlignTop">
                                                    <fieldset class="marginbottom--small" id="" >
                                                        <input
                                                                type="text"
                                                                class="kuiTextInput fullwidth"
                                                                ng-model="indexpermission.index_patterns[$index]"
                                                                name=""
                                                                autoFocus
                                                                id="opendistro_security.input.roles.indexpatterns.{{$parent.$index}}.{{$index}}">
                                                    </fieldset>
                                                </td>
                                                <td class="kuiTableRowCell cellAlignTop actions">
                                                    <a
                                                            tooltip="Delete field {{indexpermission.index_patterns[$index]}}"
                                                            ng-click="confirmRemoveArrayEntry(indexpermission.index_patterns, indexpattern)"
                                                            class="kuiButton kuiButton--danger kuiButton--iconText"
                                                            id="opendistro_security.button.roles.indexpatterns.delete.{{$index}}">
                                                        <span class="kuiButton__icon kuiIcon fa-trash-o"></span>
                                                    </a>
                                                </td>
                                            </tr>
                                            <tr class="kuiTableRow">
                                                <td class="kuiTableRowCell cellAlignTop actions"></td>
                                                <td class="kuiTableRowCell cellAlignTop actions">
                                                    <button type="button"
                                                            ng-click="addArrayEntry(indexpermission, 'index_patterns', '')"
                                                            ng-disabled="lastArrayEntryEmpty(indexpermission.index_patterns)"
                                                            class="kuiButton kuiButton--primary kuiButton--iconText"
                                                            id="opendistro_security.button.roles.index_patterns.add">
                                                        <span class="kuiButton__icon kuiIcon fa-plus"></span>
                                                        Add index pattern
                                                    </button>
                                                </td>
                                            </tr>
                                            </tbody>
                                        </table>

                                        <!-- Index Permissions -->
                                        <securityc-permissions on-should-confirm="confirmRemoveArrayEntry" permissionsResource="indexpermission.allowed_actions"></securityc-permissions>

                                        <!-- DLS -->
                                        <table class="kuiTable tableIndexGroups">
                                            <thead>
                                            <tr>
                                                <th class="kuiTableHeaderCell tableHeaderCellIndexGroups">

                                                    <div class="kuiTableHeaderCell__liner">
                                                        Document Level Security Query
                                                        <div style="display: inline;">
                                                <span class="kuiInfoButton help" tooltip='Use Elasticsearch’s full Query DSL for configuring the query used for Document Level Security. The query must be a valid JSON string, e.g. {"match": {"category": "event"}}'>
                                                    <span class="kuiIcon fa-info-circle"></span>
                                                </span>
                                                        </div>
                                                    </div>
                                                </th>

                                                <th class="kuiTableHeaderCell">
                                                </th>
                                            </tr>
                                            </thead>
                                            <tbody>
                                            <tr class="kuiTableRow">
                                                <td class="kuiTableRowCell cellAlignTop">
                                                    <fieldset class="marginbottom--small" id="object-form-actiongroups-dls">
                                                        <div
                                                                id="object-form-dls-json-raw-{{$index}}"
                                                                name="jsonRaw"
                                                                ui-ace="{ onLoad: aceRwLoaded, mode: 'json' }"
                                                                ng-model="indexpermission.dls">
                                                        </div
                                                    </fieldset>
                                                </td>
                                                <td class="kuiTableRowCell cellAlignTop actions">
                                                    <a tooltip="Test DLS query syntax" ng-click="testDls($index, indexpermission.dls, indexpermission.index_patterns[0])" class="kuiButton kuiButton--secondary kuiButton--iconText" title="Check Syntax">
                                                        <span class="kuiButton__icon kuiIcon fa-check"></span>
                                                    </a>
                                                    <a tooltip="Delete DLS query" ng-click="indexpermission.dls=''" class="kuiButton kuiButton--danger kuiButton--iconText" title="Delete DLS query">
                                                        <span class="kuiButton__icon kuiIcon fa-trash-o"></span>
                                                    </a>
                                                </td>
                                            </tr>
                                            </tbody>
                                        </table>

                                        <!-- FLS -->
                                        <table class="kuiTable tableIndexGroups">
                                            <thead>
                                            <tr>
                                                <th class="kuiTableHeaderCell tableHeaderCellIndexGroups">
                                                    <div class="kuiTableHeaderCell__liner">
                                                        Include or exclude fields
                                                        <div style="display: inline;">
                                                <span class="kuiInfoButton help" tooltip='Include or exclude fields from documents returned by Elasticsearch.'>
                                                    <span class="kuiIcon fa-info-circle"></span>
                                                </span>
                                                        </div>
                                                    </div>
                                                </th>
                                                <th class="kuiTableHeaderCell tableHeaderCellIndexGroups actions">
                                                    <div class="kuiTableHeaderCell__liner">
                                                        <select class="kuiSelect" name="flsModeSelect" ng-model="indexpermission.flsmode">
                                                            <option value="whitelist" id="opendistro_security.option.roles.fls.whitelist">Include fields</option>
                                                            <option value="blacklist" id="opendistro_security.option.roles.fls.blacklist">Exclude fields</option>
                                                        </select>
                                                    </div>
                                                </th>
                                            </tr>
                                            </thead>
                                            <tbody>
                                            <tr class="kuiTableRow" ng-if="!indexpermission.fls.length">
                                                <td colspan="2" class="kuiTableRowCell">
                                                    <div class="kuiPanel--centered">
                                                        <div class="kuiEmptyTablePrompt kuiEmptyTablePrompt--nopadding">
                                                            <div class="kuiEmptyTablePrompt__message ng-binding">No fields configured.</div>
                                                        </div>
                                                    </div>
                                                </td>
                                            </tr>

                                            <tr data-ng-repeat="flsfield in indexpermission.fls track by $index">
                                                <td class="kuiTableRowCell cellAlignTop">
                                                    <fieldset class="marginbottom--small" id="" >
                                                        <input
                                                                type="text"
                                                                class="kuiTextInput fullwidth"
                                                                ng-model="indexpermission.fls[$index]"
                                                                name=""
                                                                id="opendistro_security.input.roles.fls.{{indexpermission.fls[$index]}}">
                                                    </fieldset>
                                                </td>
                                                <td class="kuiTableRowCell cellAlignTop actions">
                                                    <a
                                                            tooltip="Delete field {{indexpermission.fls[$index]}}"
                                                            ng-click="confirmRemoveArrayEntry(indexpermission.fls, flsfield)"
                                                            class="kuiButton kuiButton--danger kuiButton--iconText"
                                                            id="opendistro_security.button.roles.fls.delete.{{indexpermission.fls[$index]}}">
                                                        <span class="kuiButton__icon kuiIcon fa-trash-o"></span>
                                                    </a>
                                                </td>
                                            </tr>
                                            <tr class="kuiTableRow">
                                                <td class="kuiTableRowCell cellAlignTop actions"></td>
                                                <td class="kuiTableRowCell cellAlignTop actions">
                                                    <button
                                                            type="button"
                                                            ng-click="addArrayEntry(indexpermission, 'fls', '')"
                                                            ng-disabled="lastArrayEntryEmpty(indexpermission.fls)"
                                                            class="kuiButton kuiButton--primary kuiButton--iconText"
                                                            id="opendistro_security.button.roles.fls.add">
                                                        <span class="kuiButton__icon kuiIcon fa-plus"></span>
                                                        Add Field
                                                    </button>
                                                </td>
                                            </tr>
                                            </tbody>
                                        </table>

                                        <!-- FLS Masked Fields Table -->
                                        <table class="kuiTable tableIndexGroups" ng-show="complianceFeaturesEnabled">
                                            <thead>
                                            <tr>
                                                <th class="kuiTableHeaderCell tableHeaderCellIndexGroups">
                                                    <div class="kuiTableHeaderCell__liner">
                                                        Anonymize fields:
                                                        <div style="display: inline;">
                                                <span class="kuiInfoButton help" tooltip='Replace the value of these fields with an anonymized hash.'>
                                                    <span class="kuiIcon fa-info-circle"></span>
                                                </span>
                                                        </div>
                                                    </div>
                                                </th>
                                                <th class="kuiTableHeaderCell tableHeaderCellIndexGroups actions">
                                                    <div class="kuiTableHeaderCell__liner">
                                                    </div>
                                                </th>
                                            </tr>
                                            </thead>
                                            <tbody>
                                            <tr class="kuiTableRow" ng-if="!indexpermission.masked_fields.length">
                                                <td class="kuiTableRowCell" colspan="2" >
                                                    <div class="kuiPanel--centered">
                                                        <div class="kuiEmptyTablePrompt kuiEmptyTablePrompt--nopadding">
                                                            <div class="kuiEmptyTablePrompt__message ng-binding">No anonymized fields configured.</div>
                                                        </div>
                                                    </div>
                                                </td>
                                            </tr>

                                            <tr data-ng-repeat="maskedfield in indexpermission.masked_fields track by $index">
                                                <td class="kuiTableRowCell cellAlignTop">
                                                    <fieldset class="marginbottom--small" id="" >
                                                        <input
                                                                type="text"
                                                                class="kuiTextInput fullwidth"
                                                                ng-model="indexpermission.masked_fields[$index]"
                                                                name=""
                                                                id="opendistro_security.input.roles.maskedfields.{{$index}}">
                                                    </fieldset>
                                                </td>
                                                <td class="kuiTableRowCell cellAlignTop actions">
                                                    <a
                                                            tooltip="Delete field {{indexpermission.masked_fields[$index]}}"
                                                            ng-click="confirmRemoveArrayEntry(indexpermission.masked_fields, maskedfield)"
                                                            class="kuiButton kuiButton--danger kuiButton--iconText"
                                                            id="opendistro_security.button.roles.maskedfields.delete.{{$index}}">
                                                        <span class="kuiButton__icon kuiIcon fa-trash-o"></span>
                                                    </a>
                                                </td>
                                            </tr>
                                            <tr class="kuiTableRow">
                                                <td class="kuiTableRowCell cellAlignTop actions"></td>
                                                <td class="kuiTableRowCell cellAlignTop actions">
                                                    <button type="button"
                                                            ng-click="addArrayEntry(indexpermission, 'masked_fields', '')"
                                                            ng-disabled="lastArrayEntryEmpty(indexpermission.masked_fields)"
                                                            class="kuiButton kuiButton--primary kuiButton--iconText"
                                                            id="opendistro_security.button.roles.maskedfields.add">
                                                        <span class="kuiButton__icon kuiIcon fa-plus"></span>
                                                        Add Field
                                                    </button>
                                                </td>
                                            </tr>
                                            </tbody>
                                        </table>

                                    </accordeon>
                                </div>
                            </div>
                        </div>

                        <div ng-show="selectedTab=='applicationpermissions'">
                            <table class="fullwidth">
                                <tr>
                                    <td>
                                        <h3 class="resourcename euiTitle euiTitle--medium">
                                            {{resourcelabel}}: <span ng-class="{'noresourcename': !resourcename}">{{resourcename || '(no role name defined)'}}</span>
                                            <div class="kuiBadge kuiBadge--default" ng-if="resource.reserved">
                                                <span class="euiBadge euiBadge--default">
                                                  <span class="euiBadge__content">
                                                        <span class="euiIcon euiIcon--small euiBadge__icon kuiIcon fa-lock"></span>
                                                    <span class="euiBadge__text">reserved</span>
                                                  </span>
                                                </span>
                                            </div>
                                        </h3>
                                    </td>
                                </tr>
                            </table>

                            <!-- Global application permissions -->
                            <div class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionRow euiFlexGroup--responsive" ng-if="globalEnabled">
                                <div class="euiFlexItem">
                                    <h3 class="euiTitle euiTitle--small">Global permissions</h3>
                                </div>
                            </div>

                            <!-- Application permissions -->
                            <table class="kuiTable tableIndexGroups" ng-if="globalEnabled">
                                <thead>
                                <tr>
                                    <th class="kuiTableHeaderCell tableHeaderCellIndexGroups">
                                        <div class="kuiTableHeaderCell__liner">
                                            Permissions:
                                            <div style="display: inline;">
                                                <span class="kuiInfoButton help" tooltip='The permissions that apply for globally.'>
                                                    <span class="kuiIcon fa-info-circle"></span>
                                                </span>
                                            </div>
                                        </div>
                                    </th>
                                    <th class="kuiTableHeaderCell tableHeaderCellIndexGroups actions">
                                        <div class="kuiTableHeaderCell__liner">
                                        </div>
                                    </th>
                                </tr>
                                </thead>
                                <tbody>

                                <tr class="kuiTableRow" ng-if="!resource.global_application_permissions.length">
                                    <td class="kuiTableRowCell" colspan="2" >
                                        <div class="kuiPanel--centered">
                                            <div class="kuiEmptyTablePrompt kuiEmptyTablePrompt--nopadding">
                                                <div class="kuiEmptyTablePrompt__message ng-binding">No global permissions configured.</div>
                                            </div>
                                        </div>
                                    </td>
                                </tr>
                                <tr data-ng-repeat="permission in resource.global_application_permissions track by $index">
                                    <td class="kuiTableRowCell cellAlignTop">
                                        <fieldset class="marginbottom--small" id="object-form-actiongroupsecuritylobal">
                                            <ui-select ng-model="resource.global_application_permissions[$index]">
                                                <ui-select-match placeholder="Permission name">
                                                    {{resource.global_application_permissions[$index]}}
                                                </ui-select-match>
                                                <ui-select-choices repeat="item in (applicationActionGroups | filter: $select.search) track by $index">
                                                    <span ng-bind="item"></span>
                                                </ui-select-choices>
                                            </ui-select>
                                        </fieldset>
                                    </td>
                                    <td class="kuiTableRowCell cellAlignTop actions">
                                        <a
                                                tooltip="Delete field {{permission}}"
                                                ng-click="confirmRemoveArrayEntry(resource.global_application_permissions, permission)"
                                                class="kuiButton kuiButton--danger kuiButton--iconText"
                                                id="opendistro_security.button.roles.applicationpermissionsglobal.delete.{{$index}}">
                                            <span class="kuiButton__icon kuiIcon fa-trash-o"></span>
                                        </a>
                                    </td>
                                </tr>
                                <tr class="kuiTableRow">
                                    <td class="kuiTableRowCell cellAlignTop actions"></td>
                                    <td class="kuiTableRowCell cellAlignTop actions">
                                        <button type="button"
                                                ng-click="addArrayEntry(resource, 'global_application_permissions', '')"
                                                ng-disabled="lastArrayEntryEmpty(resource.global_application_permissions)"
                                                class="kuiButton kuiButton--primary kuiButton--iconText"
                                                id="opendistro_security.button.roles.applicationpermissionsglobal.add">
                                            <span class="kuiButton__icon kuiIcon fa-plus"></span>
                                            Add Field
                                        </button>
                                    </td>
                                </tr>

                                </tbody>
                            </table>


                            <hr class="euiHorizontalRule euiHorizontalRule--full euiHorizontalRule--marginLarge" ng-if="multiTenancyEnabled">

                            <div class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionRow euiFlexGroup--responsive" ng-if="multiTenancyEnabled">
                                <div class="euiFlexItem">
                                    <h3 class="euiTitle euiTitle--small">Tenant permissions</h3>
                                </div>
                            </div>

                            <!-- Add tenant permissions -->
                            <div class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionRow euiFlexGroup--responsive" ng-if="multiTenancyEnabled">
                                <div class="euiFlexItem">
                                    <h2 ng-show="tenantPermissionsEmpty()" class="euiTitle euiTitle--xsmall topBottomMargin ng-cloak" >No tenant permissions configured.</h2>
                                </div>
                                <div class="euiFlexItem euiFlexItem--flexGrowZero ">
                                    <button class="euiButton euiButton--primary eui-alignMiddle" type="button" style="margin-top:15px;"
                                            id="opendistro_security.button.roles.index_appliicationpermissions.add"
                                            ng-click="addEmptyTenantPermissions()"
                                    >
                                    <span class="euiButton__content">
                                        <span class="euiButton__text">Add tenant permissions</span>
                                    </span>
                                    </button>
                                </div>
                            </div>

                            <div class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionRow euiFlexGroup--responsive" data-ng-repeat="tenantpermission in resource.tenant_permissions track by $index" ng-if="multiTenancyEnabled">
                                <div class="euiFlexItem">
                                    <accordeon title="Tenant patterns: {{getAccordeonTitle(tenantpermission.tenant_patterns, '(no tenant patterns configured)')}}" is-collapsed="tenantpermission.collapsed" testid="opendistro_security.roles.tenantpermissions-{{$index}}" additional-class="euiTitle euiTitle--xsmall">

                                        <!-- Delete index permissions -->
                                        <div class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionRow euiFlexGroup--responsive">
                                            <div class="euiFlexItem">
                                                <h2 class="euiTitle euiTitle--xsmall topBottomMargin" ></h2>
                                            </div>
                                            <div class="euiFlexItem euiFlexItem--flexGrowZero ">
                                                <button class="euiButton euiButton--danger eui-alignMiddle" type="button" style="margin-bottom:15px;"
                                                        id="opendistro_security.button.roles.tenant_permissions.delete"
                                                        ng-click="confirmRemoveFromObjectArray(resource.tenant_permissions, $index, getAccordeonTitle(tenantpermission.tenant_patterns, ''))">
                                                    <span class="euiButton__content">
                                                        <span class="euiButton__text">Delete tenant permissions</span>
                                                    </span>
                                                </button>
                                            </div>
                                        </div>

                                        <!-- Index patterns table -->
                                        <table class="kuiTable tableIndexGroups">
                                            <thead>
                                            <tr>
                                                <th class="kuiTableHeaderCell tableHeaderCellIndexGroups">
                                                    <div class="kuiTableHeaderCell__liner">
                                                        Tenant patterns:
                                                        <div style="display: inline;">
                                                <span class="kuiInfoButton help" tooltip='The tenants the permissions apply to. You can use wildcards here.'>
                                                    <span class="kuiIcon fa-info-circle"></span>
                                                </span>
                                                        </div>
                                                    </div>
                                                </th>
                                                <th class="kuiTableHeaderCell tableHeaderCellIndexGroups actions">
                                                    <div class="kuiTableHeaderCell__liner">
                                                    </div>
                                                </th>
                                            </tr>
                                            </thead>
                                            <tbody>
                                            <tr class="kuiTableRow" ng-if="!tenantpermission.tenant_patterns.length">
                                                <td class="kuiTableRowCell" colspan="2" >
                                                    <div class="kuiPanel--centered">
                                                        <div class="kuiEmptyTablePrompt kuiEmptyTablePrompt--nopadding">
                                                            <div class="kuiEmptyTablePrompt__message ng-binding">No tenant patterns configured.</div>
                                                        </div>
                                                    </div>
                                                </td>
                                            </tr>

                                            <tr data-ng-repeat="tenantpattern in tenantpermission.tenant_patterns track by $index">
                                                <td class="kuiTableRowCell cellAlignTop">
                                                    <fieldset class="marginbottom--small">
                                                        <input
                                                                type="text"
                                                                class="kuiTextInput fullwidth"
                                                                ng-model="tenantpermission.tenant_patterns[$index]"
                                                                name=""
                                                                id="opendistro_security.input.roles.tenantpatterns.{{$index}}">
                                                    </fieldset>
                                                </td>
                                                <td class="kuiTableRowCell cellAlignTop actions">
                                                    <a
                                                            tooltip="Delete field {{tenantpermission.tenant_patterns[$index]}}"
                                                            ng-click="confirmRemoveArrayEntry(tenantpermission.tenant_patterns, tenantpattern)"
                                                            class="kuiButton kuiButton--danger kuiButton--iconText"
                                                            id="opendistro_security.button.roles.tenantpatterns.delete.{{$index}}">
                                                        <span class="kuiButton__icon kuiIcon fa-trash-o"></span>
                                                    </a>
                                                </td>
                                            </tr>
                                            <tr class="kuiTableRow">
                                                <td class="kuiTableRowCell cellAlignTop actions"></td>
                                                <td class="kuiTableRowCell cellAlignTop actions">
                                                    <button type="button"
                                                            ng-click="addArrayEntry(tenantpermission, 'tenant_patterns', '')"
                                                            ng-disabled="lastArrayEntryEmpty(tenantpermission.tenant_patterns)"
                                                            class="kuiButton kuiButton--primary kuiButton--iconText"
                                                            id="opendistro_security.button.roles.tenant_patterns.add">
                                                        <span class="kuiButton__icon kuiIcon fa-plus"></span>
                                                        Add tenant pattern
                                                    </button>
                                                </td>
                                            </tr>
                                            </tbody>
                                        </table>

                                        <!-- Application permissions -->
                                        <table class="kuiTable tableIndexGroups">
                                            <thead>
                                            <tr>
                                                <th class="kuiTableHeaderCell tableHeaderCellIndexGroups">
                                                    <div class="kuiTableHeaderCell__liner">
                                                        Permissions:
                                                        <div style="display: inline;">
                                                <span class="kuiInfoButton help" tooltip='The permissions that apply for this tenant.'>
                                                    <span class="kuiIcon fa-info-circle"></span>
                                                </span>
                                                        </div>
                                                    </div>
                                                </th>
                                                <th class="kuiTableHeaderCell tableHeaderCellIndexGroups actions">
                                                    <div class="kuiTableHeaderCell__liner">
                                                    </div>
                                                </th>
                                            </tr>
                                            </thead>
                                            <tbody>
                                            <tr class="kuiTableRow" ng-if="!tenantpermission.allowed_actions.length">
                                                <td class="kuiTableRowCell" colspan="2" >
                                                    <div class="kuiPanel--centered">
                                                        <div class="kuiEmptyTablePrompt kuiEmptyTablePrompt--nopadding">
                                                            <div class="kuiEmptyTablePrompt__message ng-binding">No application permissions configured.</div>
                                                        </div>
                                                    </div>
                                                </td>
                                            </tr>

                                            <tr data-ng-repeat="permission in tenantpermission.allowed_actions track by $index">
                                                <td class="kuiTableRowCell cellAlignTop">
                                                    <fieldset class="marginbottom--small" id="object-form-actiongroups">
                                                        <ui-select ng-model="tenantpermission.allowed_actions[$index]">
                                                            <ui-select-match placeholder="Permission name">
                                                                {{tenantpermission.allowed_actions[$index]}}
                                                            </ui-select-match>
                                                            <ui-select-choices repeat="item in (applicationActionGroups | filter: $select.search) track by $index">
                                                                <span ng-bind="item"></span>
                                                            </ui-select-choices>
                                                        </ui-select>
                                                    </fieldset>
                                                </td>
                                                <td class="kuiTableRowCell cellAlignTop actions">
                                                    <a
                                                            tooltip="Delete field {{tenantpermission.allowed_actions[$index]}}"
                                                            ng-click="confirmRemoveArrayEntry(tenantpermission.allowed_actions, permission)"
                                                            class="kuiButton kuiButton--danger kuiButton--iconText"
                                                            id="opendistro_security.button.roles.applicationpermissions.delete.{{$index}}">
                                                        <span class="kuiButton__icon kuiIcon fa-trash-o"></span>
                                                    </a>
                                                </td>
                                            </tr>
                                            <tr class="kuiTableRow">
                                                <td class="kuiTableRowCell cellAlignTop actions"></td>
                                                <td class="kuiTableRowCell cellAlignTop actions">
                                                    <button type="button"
                                                            ng-click="addArrayEntry(tenantpermission, 'allowed_actions', '')"
                                                            ng-disabled="lastArrayEntryEmpty(tenantpermission.allowed_actions)"
                                                            class="kuiButton kuiButton--primary kuiButton--iconText"
                                                            id="opendistro_security.button.roles.applicationpermissions.add">
                                                        <span class="kuiButton__icon kuiIcon fa-plus"></span>
                                                        Add Field
                                                    </button>
                                                </td>
                                            </tr>
                                            </tbody>
                                        </table>
                                    </accordeon>
                                </div>
                            </div>
                        </div>
                        <div class="formsubmit" style="margin-top:20px;">
                            <button id="opendistro_security.button.submit" ng-if="!addingIndex" ng-disabled="!endpointAndMethodEnabled('ROLES', 'PUT') || resource.reserved"  class="kuiButton kuiButton--primary kuiButton--text" type="submit">Save Role Definition</button>
                            <button id="opendistro_security.button.cancel" ng-if="!addingIndex" class="kuiButton kuiButton--basic kuiButton--text" type="button" ng-click="cancel()">Cancel</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
        <securityc-confirmation-modal ng-if="deleteFromEditModal.displayModal"
                                header="{{deleteFromEditModal.header}}"
                                body="{{deleteFromEditModal.body}}"
                                params="deleteFromEditModal.params"
                                on-confirm="deleteFromEditModal.onConfirm"
                                on-close="deleteFromEditModal.onClose"
        ></securityc-confirmation-modal>
    </div>
</div>